<template>
    <div class="about">
      <h1>关于我们：</h1>
      <p>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 欢迎来到GiliGili在线教学平台！我们致力于为所有用户提供便捷、互动式的在线学习体验。

无论您是学习者还是教育者，GiliGili都为您提供了一个理想的平台。我们的系统不仅方便用户浏览和选择感兴趣的课程，还支持通过在线学习拓展知识。

用户可以在GiliGili上享受优质的学习资源和互动功能。每一门课程都经过严格的筛选和审核，以确保内容的质量和实用性。您可以通过参与课程讨论、分享学习心得，和其他学习者交流互动，共同进步。</p>


<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;对于教育者，GiliGili是一个完美的分享平台。您可以创建、管理课程，设计丰富的教学内容，与广大用户分享您的知识和经验。我们提供了全面的工具来帮助您推广课程，并从中获取合理的收益。

我们的管理员团队致力于维护平台的内容质量和社区秩序。他们负责审核课程内容和处理不当评论，确保平台上的每一份内容都符合我们的严格标准，为所有用户提供一个安全、友好的学习环境。

GiliGili欢迎每一位用户加入我们的学习社区，与我们一起推动教育的进步和创新！
      </p>
      <div style="text-align: center;">
      <button style="display: inline-block;" @click="navigateToHome">回到主页</button>
    </div>
  </div>
  </template>
  
  <script>
  export default {
    name: 'AboutPage',
    methods: {
      navigateToHome() {
        this.$router.replace('/HomeView');
      }
    }
  };
  </script>
  
  <style scoped>
  .about {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    font-family: Arial, sans-serif;
    line-height: 1.6;
  }
  .about h1 {
    font-size: 2.5em;
    margin-bottom: 15px;
  }
  .about p {
    font-size: 1.1em;
    margin-bottom: 15px;
  }
  button {

  width: 6rem;
  height: 2.25rem;
  background-color: #ff9bad;
  color: white;
  border: none;
  border-radius: 3rem;
  font-size: 0.8em;
  font-weight: 700;
  cursor: pointer;
  transition: all .2s;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

button:hover {
  color: #ff9bad;
}

button:after {
  content: "";
  background: white;
  position: absolute;
  z-index: -1;
  left: -20%;
  right: -20%;
  top: 0;
  bottom: 0;
  transform: skew(-45deg) scale(0, 1);
  transition: all 0.5s;
}

button:hover:after {
  transform: skew(-45deg) scale(1, 1);
}

  </style>
  